<template>
  <VanGrid
    class="goods-grid"
    :border="false"
    :column-num="2"
    :gutter="12"
    :center="false"
    style="margin-left: -12px; margin-right: -12px"
  >
    <template v-for="(item, index) of list" :key="index">
      <VanGridItem>
        <slot :goods="item" :index="index"></slot>
      </VanGridItem>
    </template>
  </VanGrid>
</template>

<script setup>
defineProps({
  list: {
    type: Array,
    default: () => {
      return [];
    },
  },
});
</script>

<style lang="scss" scoped>
.goods-grid {
  --van-grid-item-content-padding: 0;
}
::v-deep(.over-view) {
  height: 100%;
}
::v-deep(.van-grid-item) {
  overflow: hidden;
}
::v-deep(.van-grid-item__content) {
  border-radius: var(--dx-radius-sm);
}
</style>
